Ext.define('aps.relacionarItemPanel', {
    extend: 'Ext.Panel',
    alias : 'aps.relacionarItemPanel',

    id:         'relacionar_items_params_panel',
    name:       'relacionar_items_params_panel',
    layout:     'vbox',
    height:     100,
    frame:      true,
    closable:   false,
    border:     false,
  
    initComponent: function() {
        var combo_tipo_relacion = Ext.create('Ext.form.ComboBox',{
            id:            'combo_tipo_relacion',
            fieldLabel:    '<b>Tipo de relacion</b>',
            width:         450,
            margin:        '2 2 2 2',
            editable:      false,
            emptyText:     'seleccione el tipo de relacion...',
            mode:          'local',
            displayField:  'tipo',
            valueField:    'valor',
            store: new Ext.data.SimpleStore({
                id:     0,
                fields: ['tipo','valor'],  
                data:   [['PADRE-HIJO','PH'],['ANTECESOR-SUCESOR','AS']]
            }),
            listeners: {
                select : function(combo, records, opts){
                    var tipo_relacion  = records[0].data.valor;
                    var id_destino     = Ext.getCmp('id_item_destino').getValue();
                    var id_proyecto    = Ext.getCmp('combo-proyecto').valueModels[0].data.idproyecto;
                    var cb_item_origen = Ext.getCmp('combo_item_origen');
                    // Llenamos el combo con los posibles origenes
                    cb_item_origen.lastQuery = null;
                    cb_item_origen.store.removeAll();
                    cb_item_origen.store.load({
                        params:{
                            destino:  id_destino,
                            tipo:     tipo_relacion,
                            proyecto: id_proyecto
                        }
                    });
                    cb_item_origen.enable();
                }
            }
        });
        var combo_item_origen = Ext.create('Ext.form.ComboBox',{
            id:             'combo_item_origen',
            fieldLabel:     '<b>Relacionar con</b>',
            width:          450,
            margin:         '2 2 2 2',
            emptyText:      'Seleccione un tipo de item ...',
            displayField:   'nombre',
            valueField:     'id',
            triggerAction:  'all',
            forceSelection: true,
            editable:       false,
            queryMode :     'remote',
            store: Ext.create('Ext.data.Store', {
                fields: [
                    {name:'id',           type:'string'},
                    {name:'nombre',       type:'string'}
                ],
                proxy: {
                    type: 'ajax',
                    url:  '/consultar_item_origen',
                    params: {
                        origen:   -1,
                        tipo:     '',
                        proyecto: -1
                    },
                    reader: {
                        type: 'json',
                        root: 'data',
                        totalProperty: 'total'
                    }
                }
            }),
            listeners : {
                afterrender : function(combo, opts){
                    combo.disable();
                }
            }
        });
        this.items = [{
                xtype: 'hiddenfield',
                name:  'id_item_destino',
                id:    'id_item_destino'
            },{
                xtype: 'hiddenfield',
                name:  'id_proyecto',
                id:    'id_proyecto'
            },
            combo_tipo_relacion,
            combo_item_origen
        ]
        this.callParent(arguments);
    }
});
